<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>定位和浮动</title>
    <style>
        h5 {
            float: left;
        }

        .top {
    width: 100%;
    height: 70px;
    background-color: #ff4653;}

       .topcenter{
    width: 1000px;
    height: 100%;
    background-color: #777777;
    font-size: 20px;
    text-align: center;
    margin: 0px auto 0px auto;
       }
    </style>
</head>
<body>
    <div class="top">
        <h5>顶层</h5>
        <div class="topcenter">顶层中部</div>
    </div>
</body>
</html>

<!--
浮动：div块默认宽度是100%，高度由div块中的内容决定，是从上到下排列的。但网页中常有div块横向排列的情况，需要将div块浮动。
文本默认也占据一定空间。div、h1、p标签其实都是块级元素，span行级。
定位 position:

static 静态定位
fixed  好像淘宝网右侧的浮动工具栏，随着网页翻动，工具栏一直显示在当前视野内
relative 相对定位，常与绝对定位连用，作为其父元素。
absolute 绝对定位，常用属性top left。
-->




